<template>
  <div class="container">
    <van-nav-bar fixed title="分类" />
    <van-grid :gutter="20" :column-num="2">
      <van-grid-item class="icon" @click="$router.push(`/list?id=${item.id}&index=${index}`)"  v-for="(item,index) in cateList" :key ="item.id">
          <i class="fa" :class="item.icon"></i>
          {{item.catename}}
      </van-grid-item>
    </van-grid>
  </div>
</template>

<script>
import request from '@/utils/request'
export default {
  name: 'cateName',
  data () {
    return {
      cateList: []
    }
  },
  async created () {
    const res = await request.get('/index/index')
    // console.log(res.data.allCate)
    this.cateList = res.data.allCate
  }
}
</script>

<style scoped lang="less">
.van-grid{
  margin-top: 40px;
}
.icon{
  font-size: 30px;
}
</style>
